<template>
  <div class="login">
    <Header>
      <a
        href="javascript:;"
        slot="logo"
        @click="gobackClickHandle"
        class="goback"
      >
        <i class="icon-arrow-left-bold"></i>
      </a>
      <span slot="title" class="login_header_title">{{
        $t('lang["' + $route.meta.title + '"]')
      }}</span>
    </Header>
    <div class="login_main">
      <LoginPanel></LoginPanel>
    </div>
    <Footer></Footer>
    <!--     <FooterNav></FooterNav>
 -->
  </div>
</template>
<script>
export default {
  name: "Login",
  components: {
    Header: () =>
      import(/* webpackChunkName: "header" */ "../components/header"),
    Footer: () =>
      import(/* webpackChunkName: "footer" */ "../components/footer"),
    LoginPanel: () =>
      import(
        /* webpackChunkName: "loginMain" */ "../components/login/loginMain"
      ),
  },
  data() {
    return {};
  },
  methods: {
    gobackClickHandle(e) {
      this.$router.go(-1);
    },
  },
};
</script>
<style lang="less">
@base: 23.44rem;
.login {
  padding: 0;
  margin: 0;
  .login_header_title {
    line-height: 45 / @base;
  }
  .login_main {
    margin: 45 / @base 0 0;
  }
  .header {
    .header_left {
      a {
        &.goback {
          width: 24 / @base;
          height: 24 / @base;
          display: block;
          margin: 10 / @base 0 10 / @base 10 / @base;
          i {
            font-size: 24 / @base;
          }
        }
      }
    }
  }
}
</style>
